import React from 'react';
import MainLayout from '@/components/layout/MainLayout';
import UserInfo from '@/components/profile/UserInfo';
import WalletCard from '@/components/profile/WalletCard';
import OrderList from '@/components/profile/OrderList';
import ActionButtons from '@/components/profile/ActionButtons';
import { useUIStore } from '@/store/ui';

const mockOrders = [
  { id: '11111111111111111111', status: '已完成' as const },
  { id: '22222222222221', status: '已支付' as const },
  { id: '33333333333331', status: '待支付' as const },
];

const ProfilePage: React.FC = () => {
  const { setCurrentView } = useUIStore();

  // Set default view when entering profile page
  React.useEffect(() => {
    setCurrentView('services');
  }, [setCurrentView]);

  return (
    <MainLayout title="我的">
      <div className="space-y-4">
        <UserInfo username="AAA" accountId="AA123" />
        <WalletCard balance={0} />
        <OrderList orders={mockOrders} />
        <ActionButtons />
      </div>
    </MainLayout>
  );
};

export default ProfilePage;